<template>
	<el-dialog :title="dataForm.boxCode+'托盘信息'"  class="my-dialog-class" width="70%" height="300" :visible.sync="dialogVisible"
		:before-close="handleClose" @opened="findDetailPage" :append-to-body="appendToBody">
		<div class="gk-layout-container">
			<el-form :model="dataForm" label-width="80px" ref="dataForm" :size=global.gSize label-position="right">
				<el-row :gutter="20">
					<el-col :span="6">

						<s-dict-form name="stockStatus" v-model="dataForm.status" />

					</el-col>
					<el-col :span="6">
						 
					</el-col>
				</el-row>
			</el-form>
			<div class="gk-layout-main" style="height:450px">
				<el-table :data="pageResultDetail.content" :key="componentKey" class='gk-main-table' :loading="loading"
					size="mini" align="left" style="width:100%; overflow:auto;">
					<el-table-column :label="$t('action.desc')" width="50" fixed="left" header-align="center"
						align="center">
						<template slot-scope="scope"> {{ scope.$index + 1 }} </template>
					</el-table-column>
					<Column prop="itemId" label="物料名称" width=500 :formatter="itemFilter" />

					<Column label="数量" prop="countDb" :formatter="countFormat" />

					<Column prop="status" label="状态" :formatter="selectionFormat" />
					<Column prop="createTime" label="入库时间" :formatter="dateFormatDay" />
					<el-table-column v-if="operation" :label="$t('action.operation')" width="80">
						<template slot-scope="scope">
							<kt-button icon="fa fa-arrow-circle-up" label=" " perms="core:coreStock:showDetail"
								v-if="scope.$index != 0" @click="handleChangePos(scope.store, scope.row, -1)" />
							<kt-button icon="fa fa-arrow-circle-down" label=" " perms="core:coreStock:showDetail"
								v-if="scope.$index != pageResultDetail.content.length - 1"
								@click="handleChangePos(scope.store, scope.row, 1)" />
						</template>
					</el-table-column>
				</el-table>
			</div>
		</div>
	</el-dialog>
</template>
<script>
import KtButton from "@/views/Core/KtButton"
import { format, formatDay } from "@/utils/datetime"
import Column from "@/views/Core/Column"
import MyTable from "@/views/Core/MyTable"
import { dictsFormat, getItemName } from "@/utils/myUtil"
import SDictForm from "@/components/Kj/SDictForm"
export default {
	name: 'CoreStockView',
	components: {
		KtButton,
		Column,
		MyTable,
		SDictForm
	},
	props: {
		appendToBody: {
			type: Boolean,
			default: true,
		},
		operation: {
			type: Boolean,
			default: false,
		},
		dialogVisible: false,
		dataForm: {
			type: Object
		}
	},
	data() {
		return {
			size: 'small',
			componentKey: 0,
			loading: false,
			pageResultDetail: {},

		}
	},
	methods: {
		findDetailPage: function () {
			this.$api.coreStockDet.GetListByStockId(this.dataForm).then((res) => {
				this.pageResultDetail = { content: res.data }
				this.componentKey += 1;
			})
		},
		handleChangePos: function (scope, row, direct) {
			row.dir = direct
			this.$api.coreStockDet.changeDetailPos(row).then((res) => {
				this.findDetailPage()
			})
		},
		dateFormatDay: function (row, column, cellValue, index) {
			return formatDay(row[column.property])
		},
		countFormat: function (row, column, cellValue, index) {
			return cellValue + dictsFormat("units", row.unit)
		},
		itemFilter: function (row, column, cellValue, index) {
			return getItemName(cellValue)
		},
		selectionFormat: function (row, column, cellValue, index) {
			let key =   "storeStatus"
			 
			return dictsFormat(key, cellValue)
		},
		handleClose: function () {
			this.$emit('stockViewHidden', {})
		},
	},
	mounted() {
	}
}
</script>

<style scoped></style>